<template>
  <el-container class="official-account-management_data-statistics">
    <!-- <el-button class="fixedRight" type="primary" icon="el-icon-sort" size="small" @click="$showHide()" /> -->
    <el-main>
      <el-card shadow="never" class="selectCard searchColumn">
        <el-form label-position="right" label-width="6rem">
          <el-row :gutter="40">
            <el-col :span="16">
              <el-form-item label="时间范围：">
                <el-date-picker v-model="params.startTime" type="date" placeholder="选择日期" />
                <i>至</i>
                <el-date-picker v-model="params.endTime" type="date" placeholder="选择日期" />
              </el-form-item>
            </el-col>
          </el-row>
          <SearchButton :default-params="params" @refreshParams="refreshParams" @getList="getList" />
        </el-form>
      </el-card>
      <el-card shadow="never" class="tableCard">
        <el-row :gutter="40">
          <el-col :span="12">
            <eChart />
          </el-col>
          <el-col :span="12">
            <img src="../../assets/home/echart.png" alt="">
          </el-col>
          <el-col :span="12">
            <img src="../../assets/home/echart.png" alt="">
          </el-col>
          <el-col :span="12">
            <img src="../../assets/home/echart.png" alt="">
          </el-col>
        </el-row>
      </el-card>

    </el-main>
  </el-container>
</template>

<script>
import eChart from './components/eCharts'
import SearchButton from '@/components/SearchButton'
export default {
  components: { SearchButton, eChart },
  data() {
    return {
      params: {
        startTime: '',
        endTime: ''
      }
    }
  },
  methods: {
    getList() {

    },
    refreshParams(params) {
      this.params = params
    }
  }
}
</script>

<style lang="scss">
.official-account-management_data-statistics {
  .tableCard {
    img {
      width: 505px;
      height: 673px;
    }
  }
}
</style>
